import React from 'react'
import { Form, Input, Select, Button, Row, Col, DatePicker } from 'antd'

const { MonthPicker, RangePicker, WeekPicker } = DatePicker;
const FormItem = Form.Item
const { Option } = Select
const TopInquire = ({ form: { getFieldDecorator, getFieldsValue, resetFields }, onSearch, onClick, onClick4, advanced }) => {
    const cz = () => {
        if (onClick) {
            onClick()
        }
    }
    const advancedss = () => {
        if (onClick4) {
            onClick4()
        }
    }
    const formItemLayout = {
        // 抽屉里面Form。二列的布局比例
        labelCol: {
            span: 6
        },
        wrapperCol: {
            span: 16
        },
    };
    return (
        <div>
            <Form>
                <Row gutter={24}>
                    <Col span={5}>
                        <FormItem label='批 号'{...formItemLayout}>
                            {
                                getFieldDecorator('batch', {
                                    getValueFromEvent: (event) => {
                                        return event.target.value.replace(/\s+/g, "")
                                    },
                                })(
                                    <Input placeholder='请输入' allowClear ></Input>
                                )
                            }
                        </FormItem>
                    </Col>
                    <Col span={5}>
                        <FormItem label='装配车间'{...formItemLayout}>
                            {
                                getFieldDecorator('gitOdd', {
                                    getValueFromEvent: (event) => {
                                        return event.target.value.replace(/\s+/g, "")
                                    },
                                })(
                                    <Input placeholder='请输入' allowClear ></Input>
                                )
                            }
                        </FormItem>
                    </Col>
                    <Col span={5}>
                        <FormItem label='装配班组'{...formItemLayout}>
                            {
                                getFieldDecorator('stock', {
                                    initialValue: '全部'
                                })(
                                    <Select allowClear={true}>
                                        <Option value='全部'>全部</Option>
                                        <Option value='大机总装'>大机总装</Option>
                                        <Option value='冷室机'>冷室机</Option>
                                        <Option value='热室机'>热室机</Option>
                                    </Select>
                                )
                            }
                        </FormItem>
                    </Col>
                    <Col span={5}>
                        <FormItem label='申请时间'{...formItemLayout}>
                            {
                                getFieldDecorator('stock1', {
                                })(
                                    <RangePicker></RangePicker>
                                )
                            }
                        </FormItem>
                    </Col>
                    <Col span={4} style={{ display: 'flex' }} className="serarch-btns">
                        <FormItem>
                            <Button type="primary" icon="search" onClick={() => onSearch(getFieldsValue())}>查询</Button>
                        </FormItem>
                        <FormItem>
                            <Button type='primary' icon={advanced ? 'up' : 'down'} onClick={() => advancedss()}>展开</Button>
                        </FormItem>
                        <FormItem>
                            <Button type="default" onClick={() => {
                                cz()
                                resetFields()
                            }}
                                icon={'redo'}
                            >重置</Button>
                        </FormItem>
                    </Col>
                </Row>
            </Form>
        </div>
    )
}
export default Form.create()(TopInquire)
